const path = require('path')
const htmlwebpackPlugin = require('html-webpack-plugin')


module.exports = {
  entry: path.join(__dirname, 'index.js'),
  output: {
    filename: '[name].js',
    path: path.join(__dirname, 'dist')
  },
  mode: 'production',
  // 文件监听配置,不依赖 webpack-dev-server.
  // 默认是 false,也就是不开启,每次修改完毕之后,都需要我们手动的webapck
  watch: true,
  // 只有在watch = true 的情况下,下列的配置才会生效.
  watchOptions: {
    ignored: /node_modules/, // 忽略当前文件夹的文件改动.
    aggregateTimeout: 300, // 等没有文件改动后的300ms才会去执行. --> 节流.
    poll: 1000 // 判断文件是否发生变化,通过不停的轮询系统指定的文件是否有修改.默认美妙轮询1000次.
    
  },
  module: {
    rules: [
      {
        test: /\.(png|jpg|gif)$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: '[name].[ext]'
            }
          }
          // {
          //   loader: 'url-loader',
          //   options: {
          //     limit: 1024 * 200, // 单位字节. 1KB
          //     fallback: 'file-loader'
          //   }
          // }
        ]
      },
      {
        test: /\.css$/,
        use: [
          'style-loader',
          'css-loader'
        ]
      }
    ]
  },
  plugins: [
    new htmlwebpackPlugin()
  ]
}